@charset 'utf-8';
@import "public/_config.scss";
body{
	height: 100%;
	@include set-bg-img( $name: "icon-back0.png", $size: 100% 100%);
	.turntable{
		position: absolute;
		position: relative;
		top: 0;
		left: 50%;
		@include prefixCss3($property: transform, $value: translate(-50%, 0));
		text-align: center;
		width: pxToRem(552);
		height: pxToRem(124);
		@include set-bg-img( $name: "icon-turntable1.png", $size: pxToRem(552) auto, $position: center center);
		.surplus{
			position: absolute;
			bottom: pxToRem(28);
			left: 50%;
			@include prefixCss3($property: transform, $value: translate(-50%, 0));
			font-size: pxToRem(32);
			color: #0071c5;
		}
	}
	.content{
		width: 100%;
		position: absolute;
		top: 50%;
		left: 50%;
		@include prefixCss3($property: transform, $value: translate(-50%, -50%));
	}
	.con{
		position: absolute;
		top: pxToRem(20);
		left: 50%;
		@include prefixCss3($property: transform, $value: translate(-50%, 0));
		width: pxToRem(588);
		height: pxToRem(588);
		@include set-bg-img( $name: "icon-content.png", $size: pxToRem(588) auto, $position: center center);

			ul{
				position: relative;
				padding: pxToRem(65) pxToRem(63);
				position: absolute;
				left: 0;
				bottom: 0;
				right: 0;
				top: 0;
				li{

					width: pxToRem(138);
					height: pxToRem(146);
					border-radius: pxToRem(8);
					overflow: hidden;
					@include set-bg-img( $name: "icon-back2.png", $size: pxToRem(138) auto, $position: center center);
					&.item{
						&:nth-child(1){
							position: absolute;
							top: pxToRem(50);
							left: pxToRem(63);
						}
						&:nth-child(2){
							position: absolute;
							top: pxToRem(50);
							left: pxToRem(225);
						}
						&:nth-child(3){
							position: absolute;
							top: pxToRem(50);
							right: pxToRem(63);
						}
						&:nth-child(4){
							position: absolute;
							top: pxToRem(211);
							right: pxToRem(63);
						}
						&:nth-child(5){
							position: absolute;
							top: pxToRem(370);
							right: pxToRem(63);
						}
						&:nth-child(6){
							position: absolute;
							top: pxToRem(370);
							left: pxToRem(225);
						}
						&:nth-child(7){
							position: absolute;
							top: pxToRem(370);
							left: pxToRem(63);
						}
						&:nth-child(8){
							position: absolute;
							top: pxToRem(211);
							left: pxToRem(63);
						}
					}
					&.nine{
						position: absolute;
						top: pxToRem(211);
						left: pxToRem(225);
						@include set-bg-img( $name: "icon-winning.png", $size: pxToRem(138) auto, $position: center center);
					}
					.img{
						margin: pxToRem(10) pxToRem(10) 0;
						border-radius: pxToRem(10);
						height: pxToRem(90);
						@include set-bg-img( $name: "icon-thank.png", $size: pxToRem(138) auto, $position: center center);
						&.phone{
							@include set-bg-img( $name: "icon-phone2.png", $size: pxToRem(138) auto, $position: center center);
						}
						&.mac{
							@include set-bg-img( $name: "icon-mac.png", $size: pxToRem(138) auto, $position: center center);
						}
						&.gift{
							@include set-bg-img( $name: "icon-gift4.png", $size: pxToRem(138) auto, $position: center center);
						}
					}
					&.winning{
						@include set-bg-img( $name: "icon-back3.png", $size: pxToRem(138) auto, $position: center center);
					}
					.name{
						font-size: pxToRem(22);
						color: #0071c5;
						text-align: center;
						padding-top: pxToRem(5);
					}
				}
			}
	}
	.last{
		margin: pxToRem(680) pxToRem(82) 0;
		text-align: center;
		color: #0071c5;
		.til{
			font-weight: bold;
			font-size: pxToRem(30);
			padding-bottom: pxToRem(32);
		}
		.message{
			font-size: pxToRem(24);
			line-height: pxToRem(34);
			img{
				display: none;
			}
		}
	}
	.gift-left{
		position: absolute;
		top: pxToRem(247);
		left: 0;
		width: pxToRem(52);
		height: pxToRem(72);
		@include set-bg-img( $name: "icon-gift1.png", $size: pxToRem(52) auto, $position: center center);
	}
	.gift-right{
		position: absolute;
		top: pxToRem(718);
		right: 0;
		width: pxToRem(54);
		height: pxToRem(86);
		@include set-bg-img( $name: "icon-gift2.png", $size: pxToRem(54) auto, $position: center center);
	}
	.gift-bottom{
		position: absolute;
		bottom: 0;
		right: 0;
		width: pxToRem(122);
		height: pxToRem(122);
		@include set-bg-img( $name: "icon-gift3.png", $size: pxToRem(122) auto, $position: center center);
	}
}
